
	Ext.Loader.setConfig({enabled: true});
	Ext.Loader.setPath('Ext.ux', '/static/pdm/extjs/ux');
	Ext.require([
		'Ext.grid.*',
		'Ext.data.*',
		'Ext.ux.grid.FiltersFeature',
		'Ext.selection.*',
		'Ext.panel.*'
	]);
	
	
	Ext.onReady(function(){
	
	
	    /* donde se administra los permisos*/
		Ext.Ajax.request({
			url: '/usuario/rol/permiso',
			params : {
			solicitud_permisos : 'interfaz_rol_bm_asignar_desasignar'
			},
			scope : this,
			success : function(response){
				info = Ext.decode(response.responseText);
				//        Ext.Msg.alert(':D',info.permiso['crear']);
				if (info.success === false){
				  Ext.Msg.alert('ERROR','No se pudo optener los permisos');
				}else{
					if (info.permiso['asignar_a_usuario']==0)
						Ext.getCmp('asignar_a_asuario').hide();

					if (info.permiso['desasignar_a_asuario']==0)
						Ext.getCmp('desasignar_a_asuario').hide();

					if (info.permiso['modificar']==0)
						Ext.getCmp('modificar').hide();
						
					if (info.permiso['eliminar']==0)
						Ext.getCmp('eliminar').hide();
				}
			}
		}); /* fin de la funcion ajax que hace la peticion de los permisos*/
	
	
		Ext.define('Rol', {
		    extend: 'Ext.data.Model',
		    fields: [
				{name: 'id_rol',  type: 'int'},
				{name: 'nombre_rol',   type: 'string'},
				{name: 'descripcion',   type: 'string'},					
		    ]
		    
		    
		});
		var store = Ext.create('Ext.data.JsonStore', {
		    model: 'Rol',
		    proxy: {
		        type: 'ajax',
		        url: '/rol/listar',
		        reader: {
		            type: 'json',
		            root: 'rols'
		        }
		    }
		});
		store.load();
		
		
		Ext.define('User', {
						extend: 'Ext.data.Model',
						fields: [
							{name: 'user_id',  type: 'int'},
							{name: 'username',   type: 'string'},
							{name: 'name',   type: 'string'},
							{name: 'apellido',   type: 'string'},
							{name: 'email',   type: 'string'},
							{name: 'telefono',  type: 'int'},			
						]
					
					
					});
					
		var store_usuario = Ext.create('Ext.data.JsonStore', {
			model: 'User',
			proxy: {
				type: 'ajax',
				url: '/usuario/listar',
				reader: {
					type: 'json',
					root: 'usuarios'
				}
			}
		});

		store_usuario.load();


		/* configuraciones para realizar el filtrado por columna*/
	   	var local = true;
	 	var filters = {
	        ftype: 'filters',
	        local: local
		};
    	
    	var grid = Ext.create('Ext.grid.Panel', {
		    width:642,
		    height:500,
		    features: [filters],
		    collapsible:false,
		    title:'Lista de Roles',
		    renderTo: 'acciones',
//			closable:true,
		    store: store,
		    multiSelect: true,
		    viewConfig: {
		        emptyText: 'No images to display'
		    },

		    columns: [{
		            text: 'ID',
		            width: 40,
		            sortable: true,
		            filterable: true,
		            dataIndex: 'id_rol'
		        },{
		            header: 'Nombre',
		            flex: 1,
		            sortable: true,
		            filterable: true,
		            dataIndex: 'nombre_rol',
		            field: {
		                type: 'textfield'
		            }
		        },{
		            header: 'Descripcion',
		            flex: 1,
		            sortable: true,
		            filterable: true,
		            dataIndex: 'descripcion',
		            field: {
		                type: 'textfield'
		            }
		        }], 
		        
		        dockedItems: [{
		        xtype: 'toolbar',
		        items: [{
			        itemId: 'modificar',
			        id:	'modificar',
		            text: 'Modificar',
		            disabled: true,
		            handler: function(){
		            var registro = grid.getView().getSelectionModel().getSelection()[0];
		            
		            var form_modificar = Ext.create('Ext.form.Panel', {
						frame:true,
						bodyStyle:'padding:5px 5px 0',
						width: 350,
						fieldDefaults: {
							msgTarget: 'side',
							labelWidth: 75
						},
						defaultType: 'textfield',
						defaults: {
							anchor: '100%'
						},

						items: [{
							fieldLabel: 'Nombre',
							name: 'nombre_rol',
							value: registro.data['nombre_rol'],
							allowBlank:false
						},{
							fieldLabel: 'Descripcion',
							value: registro.data['descripcion'],
							name: 'descripcion'
						}],

						buttons: [{
							text: 'Guardar',
							handler: function() {
								form_modificar.getForm().submit({
								url: "/rol/modificar",
								params: {
									submit: "submit",
									id_rol:registro.data['id_rol']
								},
								method: "post",
								waitTitle:'Conectando', 
								waitMsg:'Enviando datos...',
								success: function() {							
									Ext.Msg.alert(":D", "El rol fue modificado con exito");
									grid.store.load();
								},
								failure: function() {
									Ext.Msg.alert(":(", "No se pudo almacenar el rol");
								}	
							})
							
							}
						},{
							text: 'Cancelar',
							handler: function() {
					            this.up('form').getForm().reset();
					            this.up('window').hide();
					        }
						
						}]
					});

					Ext.create('Ext.window.Window', {
						title: 'Modifica Rol',
						plain:true,
						resizable: true,
			            modal: true,
						height: 200,
						width: 400,
						layout: 'fit',
						items: form_modificar,
					}).show();

		            }
		        }, '-', {
		            itemId: 'eliminar',
		            id:	'eliminar',
		            text: 'Eliminar',
		            disabled: true,
		            handler: function(){
		                var selection = grid.getView().getSelectionModel().getSelection()[0];
		                if (selection) {
		                  	var id_rol = grid.getView().getSelectionModel().getSelection()[0].data['id_rol'];	
		        
							Ext.Msg.confirm('Eliminar', 'Desea eliminar el rol?', function(btn){
							
								if(btn == 'yes') {
								
									Ext.Ajax.request({
										url: '/rol/eliminar',
										params: {
											id_rol: id_rol
										},
										success: function() {
											Ext.Msg.alert(':D', 'Ha eliminado el rol', function(btn){
												grid.store.load();
											
											})
										},
										failure: function() {
											Ext.Msg.alert(':(', 'No se pudo eliminar el rol')
										}
									})
								}											
							})   

		                }
		            }
		        },'-',{
		        	itemId: 'asignar_a_asuario',
		        	id:	'asignar_a_usuario',
		            text: 'Asignar a Usuario',
		            disabled: true,
		            handler: function(){
	/*#################### Funcion que Asigna un Rol a Usuario######################*/
		var selection1 = grid.getView().getSelectionModel().getSelection()[0];
		var id_rol = grid.getView().getSelectionModel().getSelection()[0].data['id_rol'];
		    if (selection1) {		 

				Ext.onReady(function(){					

					var selModel = Ext.create('Ext.selection.CheckboxModel', {
						listeners: {
							selectionchange: function(sm, selections) {
								listView.down('#botonAsignar').setDisabled(selections.length == 0);
							}
						}
					});


					var listView = Ext.create('Ext.grid.Panel', {
						border: false,
						features: [filters],

						store: store_usuario,						
							columns: [{
								text: 'ID',
								width: 40,
								sortable: true,
								filterable: true,
								dataIndex: 'user_id'
							},{
								header: 'Usuario',
								flex: 1,
								sortable: true,
								dataIndex: 'username',
								filterable: true,
								field: {
									type: 'textfield'
								}
							},{
								header: 'Nombre',
								flex: 1,
								sortable: true,
								dataIndex: 'name',
								filterable: true,
								field: {
									type: 'textfield'
								}
							},{
								header: 'Apellido',
								flex: 1,
								sortable: true,
								dataIndex: 'apellido',
								filterable: true,
								field: {
									type: 'textfield'
								}
							},{
								header: 'Email',
								flex: 1,
								sortable: true,
								dataIndex: 'email',
								filterable: true,
								field: {
									type: 'textfield'
								}
							},{
								header: 'Telefono',
								flex: 1,
								sortable: true,
								dataIndex: 'telefono',
								filterable: true,
								field: {
									type: 'textfield'
								}
							}],
							columnLines: true,
							selModel: selModel,
							dockedItems: [{
									xtype: 'toolbar',
									dock: 'bottom',
									ui: 'footer',
									layout: {
										pack: 'center'
									},
									items: [{
										minWidth: 80,
										text: 'Guardar',
							            itemId: 'botonAsignar',
										handler : function(){

			longitud=listView.getSelectionModel().getSelection().length;
			lista_usuarios = new Array();
			i=0;
									
			while(i < longitud)
			{											
//				lista_usuarios[i]=listView.getSelectionModel().getSelection()[i].data['user_id'];
				lista_usuarios.push(listView.getSelectionModel().getSelection()[i].data['user_id']);
				i=i+1;
			}
		
			Ext.Ajax.request({
				url: '/rol/usuario/relacion/asignar',
				params: {
					id_rol: id_rol,
					lista_usuarios:Ext.encode(lista_usuarios)
				},
				success: function() {
					Ext.Msg.alert(':D', 'La relacion usuario rol se realizo con exito')

				},
				failure: function() {
					Ext.Msg.alert(':(', 'No se pudo realizar la relacion usuario rol')
				}
			}) /*fin funcion ajax*/
		}/* fin funcion Guardar*/
									},{
										minWidth: 80,
										text: 'Cancelar',
										handler: function() {
					         			   listView.up('window').hide();
					        			}
									}]
								}]
						
						
					});

				
		Ext.create('Ext.Window', {
		title: 'Lista de Usuarios',
		plain:true,
		resizable: true,
		modal: true,
		height: 300,
		width: 500,
		layout: 'fit',
		items: listView
		}).show();
					
				}); /*fin de la funcion que contiene toda la lista de usuarios*/



		    }/* fin del if que comprueba que se selecciono algo*/
	/*##############################################################################*/
		            }/*fin de la funcion asignar a usuarios*/
		        },{
		        	itemId: 'desasignar_a_asuario',
		        	id:	'desasignar_a_usuario',
		            text: 'Desasignar a Usuario',
		            disabled: true,
		            handler: function(){
/*#################### Funcion que Desasigna un Rol a Usuario######################*/
		var selection1 = grid.getView().getSelectionModel().getSelection()[0];
		var id_rol = grid.getView().getSelectionModel().getSelection()[0].data['id_rol'];
		    if (selection1) {		 

				Ext.onReady(function(){					

					var selModel = Ext.create('Ext.selection.CheckboxModel', {
						listeners: {
							selectionchange: function(sm, selections) {
								listView.down('#botonDesasignar').setDisabled(selections.length == 0);
							}
						}
					});


					var listView = Ext.create('Ext.grid.Panel', {
						border: false,
						features: [filters],

						store: store_usuario,						
							columns: [{
								text: 'ID',
								width: 40,
								sortable: true,
								filterable: true,
								dataIndex: 'user_id'
							},{
								header: 'Usuario',
								flex: 1,
								sortable: true,
								dataIndex: 'username',
								filterable: true,
								field: {
									type: 'textfield'
								}
							},{
								header: 'Nombre',
								flex: 1,
								sortable: true,
								dataIndex: 'name',
								filterable: true,
								field: {
									type: 'textfield'
								}
							},{
								header: 'Apellido',
								flex: 1,
								sortable: true,
								dataIndex: 'apellido',
								filterable: true,
								field: {
									type: 'textfield'
								}
							},{
								header: 'Email',
								flex: 1,
								sortable: true,
								dataIndex: 'email',
								filterable: true,
								field: {
									type: 'textfield'
								}
							},{
								header: 'Telefono',
								flex: 1,
								sortable: true,
								dataIndex: 'telefono',
								filterable: true,
								field: {
									type: 'textfield'
								}
							}],
							columnLines: true,
							selModel: selModel,
							dockedItems: [{
									xtype: 'toolbar',
									dock: 'bottom',
									ui: 'footer',
									layout: {
										pack: 'center'
									},
									items: [{
										minWidth: 80,
										text: 'Guardar',
							            itemId: 'botonDesasignar',
										handler : function(){

			longitud=listView.getSelectionModel().getSelection().length;
			lista_usuarios = new Array(longitud);
			i=0;
									
			while(i < longitud)
			{											
				lista_usuarios[i]=listView.getSelectionModel().getSelection()[i].data['user_id'];
				i=i+1;
			}
		

			Ext.Ajax.request({
				url: '/rol/usuario/relacion/desasignar',
				params: {
					id_rol: id_rol,
					lista_usuarios:Ext.encode(lista_usuarios)
				},
				success: function() {
					Ext.Msg.alert(':D', 'La desasignacion del rol al usuario se realizo con exito')

				},
				failure: function() {
					Ext.Msg.alert(':(', 'No se pudo realizar la desasignacion')
				}
			}) /*fin funcion ajax*/
		}/* fin funcion Guardar*/
									},{
										minWidth: 80,
										text: 'Cancelar',
										handler: function() {
					         			   listView.up('window').hide();
					        			}
									}]
								}]
						
						
					});

				
		Ext.create('Ext.Window', {
		title: 'Lista de Usuarios',
		plain:true,
		resizable: true,
		modal: true,
		height: 300,
		width: 500,
		layout: 'fit',
		items: listView
		}).show();
					
				}); /*fin de la funcion que contiene toda la lista de usuarios*/



		    }/* fin del if que comprueba que se selecciono algo*/
	/*##############################################################################*/		            
		            
		            
		            }
				}]		            
		    }],            
		        
		});
		
		grid.getSelectionModel().on('selectionchange', function(selModel, selections){
		    grid.down('#eliminar').setDisabled(selections.length === 0);
		    grid.down('#modificar').setDisabled(selections.length === 0);
			grid.down('#asignar_a_asuario').setDisabled(selections.length === 0);
			grid.down('#desasignar_a_asuario').setDisabled(selections.length === 0);
		});

	});
						
